<template>
  <a-modal
    title="新增单位"
    :width="1200"
    :visible="visible"
    @ok="handleSubmit"
    @cancel="handleCancel"
  >
    <a-form>
      <a-row :gutter="24">
        <a-col :span="8">
          <a-form-item label="单位名称" required :labelCol="{ span: 8 }" :wrapperCol="{ span: 16 }" has-feedback>
            <a-input v-model="queryParam.organizationName" placeholder="请输入单位名称"></a-input>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            label="上级单位"
            :loading="treeLoading"
            required
            :labelCol="{ span: 8 }"
            :wrapperCol="{ span: 16 }"
            has-feedback
          >
            <a-tree-select
              v-model="queryParam.parentId"
              ref="orgTree"
              :tree-data="unitTree"
              :style="{ width: '100%' }"
              :dropdown-style="{ maxHeight: 600, overflow: 'auto' }"
              placeholder="请选择上级单位"
              allow-clear
              :show-search="true"
              :tree-default-expand-all="false"
              :tree-checkable="false"
              :tree-check-strictly="true"
              :title="queryParam.parentId"
              :rules="[{ required: true, message: '请选择上级单位'}]"
              @change="handleOrganNameClick"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item label="排序" required :labelCol="{ span: 8 }" :wrapperCol="{ span: 16 }">
            <a-input v-model="queryParam.dataSort" placeholder="请输入排序"></a-input>
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
  </a-modal>
</template>
<script>
import { addOrg, getUnitTree1 } from '@/api/modular/system/violationManage'
import { mapGetters } from 'vuex'
  export default {
    data () {
      return {
        visible: false,
        queryParam: {},
        unitTree: [],
        treeLoading: true,
        fabaotree: {
            id: '00'
        },
        title: '',
        defaultExpandedKeys: [],
        replaceFields: {
          children: 'children',
          title: 'title',
          key: 'workflowId',
          value: 'id',
          parentId: 'parentId'
        },
        secondOraName: {
          id: ''
        },
        form: this.$form.createForm(this)
      }
    },
    created() {
      this.getUnitTree()
    },
    computed: {
      ...mapGetters(['userInfo'])
    },
    // mounted() {
    // //   this.setDisabledToParent(this.unitTree)
    //   // 找出所有拥有子节点的节点并标记为“disabled”
    // //   this.unitTree.forEach((node) => {
    // //     if (node.children) {
    // //       this.disabledIds.push(node.organizationId)
    // //       node.children.forEach((child) => {
    // //         this.disabledIds.push(child.organizationId)
    // //       })
    // //     }
    // //   })
    // },
    methods: {
      // 打开页面初始化
      add () {
        this.visible = true
      },
      handleSubmit() {
        if ([this.queryParam.organizationName, this.queryParam.dataSort, this.queryParam.parentId].some(item => item === null || item === undefined)) {
          this.$message.warning('信息尚未完善，请完善后再提交')
        } else {
          console.log(this.queryParam)
          addOrg(this.queryParam).then(res => {
            console.log(this.queryParam)
            this.$message.success('保存单位成功!')
            this.getUnitTree()
            this.visible = false
            this.queryParam.dataSort = ''
            this.queryParam.organizationName = ''
            this.queryParam.parentId = ''
            this.$emit('ok')
          })
        }
      },
      handleCancel() {
        this.visible = false
        this.queryParam.dataSort = ''
        this.queryParam.organizationName = ''
        this.queryParam.parentId = ''
      },
    //   setDisabledToParent(List) {
    //     List.forEach((item) => {
    //       if (item.children && item.children.length > 0) {
    //         // 递归遍历子节点
    //         this.setDisabledToParent(item.children)
    //         // 设置父节点的 disabled 属性
    //         item.disabled = true
    //       }
    //     })
    //     // console.log(List)
    //   },
        // 组织树
      getUnitTree () {
        // console.log(this.secondOraName)
        getUnitTree1(Object.assign(this.fabaotree)).then(res => {
          this.treeLoading = false
          this.unitTree = this.transformData(res.data)
        })
        this.visible = false
      },
      transformData(data) {
        function transform(data) {
          return data.map(item => ({
            id: item.id,
            label: item.title, // 将 title 转换为 label
            value: item.value,
            children: item.children ? transform(item.children) : []
          }))
        }
        return transform(data)
      },
      handleOrganNameClick(value, label, e) {
        console.log(value)
        this.queryParam.parentId = value
      }
    }
  }
</script>
